// @import "../../style/base/variable";
@qh_red:#fd7d6a;
@qh_green:#54bb9d;
@qh_blue:#549eef;
@qh_yellow:#f5a623;
@qh_txt_gray:#646464;
@qh_bg_yellow: #FDFBF4;
@qh_list_border_color: rgba(245,166,35,0.2);

.allCategory{
	width: 100%;
	height: 100%;
	background: #FDFBF4;
	// position: relative;
	ul{
		list-style-type: none;
	}
	.categoryMenu{
		width: 1.32rem;
		height: 100%;
		position: absolute;
		background: #E5E5E5;
		overflow: scroll;
		ul.categoryMenu-list{
			width: 1.32rem;
			height: 100%;
			li{
				text-align: center;
				font-size: .22rem;
				color: #9B9B9B;
			}
			li.categoryMenu-list-block{
				padding: .12rem 0;
			}
			li.categoryMenu-list-block.active{
				background: #FDFBF4;
				border-left: .08rem solid #FDD232;
				li{
					color: #20436A;
				}
			}
			img{
				width: .58rem;
				height: .58rem;
			}
		}
	}
	.categoryCon{
		display: inline-block;
	    padding: .2rem;
	    vertical-align: top;
	    height: 100%;
	    margin-left: 1.52rem;
		span{
			border: 1px solid rgba(245,166,35,0.20);
			border-radius: .04rem;
			margin: 0rem .1rem .1rem 0rem;
			color: #3F4146;
			font-size: .22rem;
			white-space: nowrap;
			display: inline-block;
			padding:  0rem .2rem;
			display: block;
			height: 0.5rem;
			line-height: 0.5rem;
		}
		span.active{
			background: #F5A623;
			color: #fff;
		}
	}
	.cart{
			position: absolute;
			right: .4rem;
			bottom: .4rem;
			.num{
				position: absolute;
			    width: .3rem;
			    height: .3rem;
			    top: -.3rem;
			    right: 0;
			    background: @qh_red;
			    border-radius: 50%;
			    color: #fff;
			    text-align: center;
			    line-height: .3rem;
			}
			span{
				font-size: .4rem;
				padding: .2rem .15rem;
				background: rgba(63,65,70,0.80);
				color: #fff;
				border-radius: 50%;
			}
		}
}